<template>
    <a-card :bordered="false">
        <!-- 查询区域 -->
      <div class="table-page-search-wrapper">
        <a-form layout="inline" @keyup.enter.native="searchQuery">
          <a-row :gutter="24">
            <a-col :xl="6" :lg="7" :md="8" :sm="24">
              <a-form-item label="框架合同编号">
                <j-input placeholder="请输入框架合同编号" v-model="queryParam.finalNo"></j-input>
              </a-form-item>
            </a-col>
            <a-col :xl="6" :lg="7" :md="8" :sm="24">
                <a-form-item label="合同名称" class="form-item">
                <j-input placeholder="请输入合同名称" v-model="queryParam.htmc" />
              </a-form-item>
            </a-col>
            <a-col :xl="6" :lg="7" :md="8" :sm="24">
                <a-form-item label="业绩归属年度" class="form-item">
                    <j-dict-select-tag type="list" v-model="queryParam.yjgsnd" dictCode="yjgsnd" placeholder="请选择业绩归属年度" />
              </a-form-item>
            </a-col>
            <a-col :xl="6" :lg="7" :md="8" :sm="24">
                <a-form-item label="签订日期" :labelCol="labelCol">
                <a-range-picker
                  format="YYYY-MM-DD"
                  :placeholder="['开始日期', '结束日期']"
                  v-model="qdrqRange"
                  @change="(dates, dateStrs) => { queryParam.qdrq_begin = dateStrs[0]; queryParam.qdrq_end = dateStrs[1] }"
                  style="width: 100%" />
              </a-form-item>
            </a-col>
            <a-col :xl="6" :lg="7" :md="8" :sm="24">
                <a-form-item label="变更状态">
                    <j-dict-select-tag
                        type="list"
                        v-model="queryParam.changeStatus"
                        dictCode="change_status"
                        placeholder="请选择变更状态" />
                    </a-form-item>
            </a-col>
            <a-col :xl="6" :lg="7" :md="8" :sm="24">
                <a-form-item label="本次合同额" :labelCol="labelCol">
                <a-input-number
                  :precision="2"
                  placeholder="请输入最小值"
                  class="query-group-cust"
                  v-model="queryParam.bchte_begin"
                  @change="(val) => this.bchteRange = parseInt(val)"
                  style="width: 45%"
                  :min="0"
                  :max="999999999" />
                -
                <a-input-number
                  :precision="2"
                  placeholder="请输入最大值"
                  class="query-group-cust"
                  v-model="queryParam.bchte_end"
                  style="width: 45%"
                  :min="bchteRange"
                  :max="999999999" />
              </a-form-item>
            </a-col>
            <a-col :xl="6" :lg="7" :md="8" :sm="24">
                <a-form-item label="签订单位">
                 <select-Company-input v-model="queryParam.qddw" placeholder="请选择签订单位" />
              </a-form-item>
            </a-col>
            <a-col :xl="6" :lg="7" :md="8" :sm="24">
                <a-form-item label="业主单位" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <select-customer-input v-model="queryParam.yzdw" placeholder="请选择业主单位" commercialType="1" />
            </a-form-item>
            </a-col>
            <a-col :xl="6" :lg="7" :md="8" :sm="24">
                <a-form-item label="经营团队" :labelCol="labelCol" :wrapperCol="wrapperCol" >
                    <select-team-input v-model="queryParam.jytd" :tdlx="1" :teamType="0" />
            </a-form-item>
            </a-col>
            <a-col :xl="6" :lg="7" :md="8" :sm="24">
                <a-form-item label="合同档案状态">
                    <j-dict-select-tag
                  placeholder="请选择合同档案状态"
                  v-model="queryParam.status"
                  dictCode="contract_final_status" />
            </a-form-item>
            </a-col>
            
            <a-col :xl="6" :lg="7" :md="8" :sm="24">
                <a-form-item label="申请人">
                  <select-user-by-dep
                  :multi="false"
                    placeholder="请选择申请人"
                    v-model="queryParam.proposer" />
                </a-form-item>
              </a-col>

              <!-- <a-col :xl="6" :lg="7" :md="8" :sm="24">
              <a-form-item label="交单状态">
                <j-dict-select-one-tag placeholder="请选择交单状态" v-model="queryParam.recordStatus" dictCode="record_status"/>
              </a-form-item>
            </a-col> -->
            <a-col :xl="6" :lg="7" :md="8" :sm="24">
              <a-form-item label="申请部门">
                <j-select-depart v-model="queryParam.handlerDeptId" placeholder="请选择申请部门" />
              </a-form-item>
            </a-col>
            <a-col :xl="6" :lg="7" :md="8" :sm="24">
              <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
                <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
                <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
                <!-- <a @click="handleToggleSearch" style="margin-left: 8px">
                  {{ toggleSearchStatus ? '收起' : '展开' }}
                  <a-icon :type="toggleSearchStatus ? 'up' : 'down'"/>
                </a> -->
              </span>
            </a-col>
          </a-row>
        </a-form>
      </div>
      <!-- 查询区域-END -->
  
      <!-- 操作按钮区域 -->
      <div class="table-operator">
        <!-- <a-button @click="handleAdd" type="primary" icon="plus" :disabled="isDisabledAuth('erpFinancePaymentAgainstDocumentsRecord:add')">新增</a-button> -->
        <a-button type="primary" icon="download" @click="handleExportXls('框架合同档案')" :disabled="isDisabledAuth('erpFinancePaymentAgainstDocumentsRecord:export')">导出</a-button>
        <!-- <a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl" @change="handleImportExcel">
          <a-button type="primary" icon="import" :disabled="isDisabledAuth('erpFinancePaymentAgainstDocumentsRecord:import')">导入</a-button>
        </a-upload> -->
        <!-- 高级查询区域 -->
        <!--<j-super-query :fieldList="superFieldList" ref="superQueryModal" @handleSuperQuery="handleSuperQuery"></j-super-query>-->
        <!-- <a-dropdown v-if="selectedRowKeys.length > 0">
          <a-menu slot="overlay">
            <a-menu-item key="1" @click="batchDel" :disabled="isDisabledAuth('erpFinancePaymentAgainstDocumentsRecord:delete')"><a-icon type="delete"/>删除</a-menu-item>
          </a-menu>
          <a-button style="margin-left: 8px"> 批量操作 <a-icon type="down" /></a-button>
        </a-dropdown> -->
        <a-popover title="自定义列" trigger="click" placement="leftBottom">
          <template slot="content">
            <a-checkbox-group @change="onColSettingsChange" v-model="settingColumns" :defaultValue="settingColumns">
              <a-row>
                <template v-for="(item,index) in defColumns">
                  <template v-if="item.key!='rowIndex'&& item.dataIndex!='action'">
                    <a-col :span="12" :key="index"><a-checkbox :value="item.dataIndex">{{ item.title }}</a-checkbox></a-col>
                  </template>
                </template>
              </a-row>
            </a-checkbox-group>
          </template>
          <a style="float: right;"><a-icon type="setting" :style='iconStyle'/></a>
        </a-popover>
      </div>
  
      <!-- table区域-begin -->
      <div>
        <div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">
          <i class="anticon anticon-info-circle ant-alert-icon"></i> 已选择 <a style="font-weight: 600">{{ selectedRowKeys.length }}</a>项
          <a style="margin-left: 24px" @click="onClearSelected">清空</a>
        </div>
  
        <a-table
          ref="table"
          size="middle"
          :scroll="{x:scrollX}"
          bordered
          :components="draggableComponent"
          rowKey="id"
          :columns="columns"
          :dataSource="dataSource"
          :pagination="ipagination"
          :loading="loading"
          class="j-table-force-nowrap"
          :customRow="customRow"
          :expandedRowKeys="expandedRowKeys"
          @expand="expand"
          :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
          @change="handleTableChange">
          <template slot="expandedRowRender" slot-scope="text,record">
            <p style="color:#000"><b>收款合同档案一栏表</b></p>
            <a-table
            ref="table"
            size="small"
            :scroll="{x:true}"
             bordered
              :columns="innerColumns"
              :dataSource="innerDataSource"
              :pagination="false"
              :locale="{emptyText: '暂无数据' }">
             
              <!-- <template slot="fileSlot" slot-scope="text">
                {{ text }}----<p>{{ record.renderList }}</p>
              </template> -->
            </a-table>
          </template>
          <a slot="billNo" slot-scope="text, record" @click="getDetail(record)">{{ text }}</a>
        </a-table>
      </div>
  
      <erp-finance-payment-against-documents-record-modal ref="modalForm" @ok="modalFormOk"></erp-finance-payment-against-documents-record-modal>
    </a-card>
  </template>
  
  <script>
  
    import '@/assets/less/TableExpand.less'
    import { mixinDevice } from '@/utils/mixin'
    import { JeecgListMixin } from '@/mixins/JeecgListMixin'
    import ErpFinancePaymentAgainstDocumentsRecordModal from '@/views/erp/finance/againstDocuments/modules/ErpFinancePaymentAgainstDocumentsRecordModal.vue'
    import { getAction,postAction } from '@/api/manage'
    import {DisabledAuthFilterMixin} from '@/mixins/DisabledAuthFilterMixin'
    import { filterMultiDictText, initDictOptions } from '@/components/dict/JDictSelectUtil'
    import SelectUserByDep from '@/views/scy/components/SelectUserByDep'
    import SelectTeamInput from '@/views/scy/components/SelectTeamInput'
    // import { getAction,postAction } from '@/api/manage'

    import SelectCustomerInput from '@/views/scy/components/SelectCustomerInput'
    import SelectCompanyInput from '@/views/scy/components/SelectCompanyInput'

    export default {
      name: 'ErpOmcFrameworkContractArchive',
      mixins:[JeecgListMixin, mixinDevice, DisabledAuthFilterMixin],
      components: {
        SelectCustomerInput,
        SelectCompanyInput,
        SelectTeamInput,
        ErpFinancePaymentAgainstDocumentsRecordModal,
        SelectUserByDep
      },
      data () {
        return {
          description: '框架合同档案页面',
          //表头
          columns:[],
          qdrqRange: [],
          queryParam: {
            htlx: '3' // 
          },
          bchteRange: 0,
          isorter: {
        column: '',
        order: ''
      },
          //列设置
          settingColumns:[],
          innerDataSource:[],
          expandedRowKeys:[],
          labelCol: {},
        wrapperCol: {
          xs: { span: 20 },
          sm: { span: 20 }
        },
          // 列定义
          innerColumns:[
          {
              title: '序号',
              dataIndex: '',
              key:'rowIndex',
              width:60,
              align:"center",
              customRender:function (t,r,index) {
                return parseInt(index)+1;
              }
            },
            {
              title:'合同档案编号',
              align:"center",
              width:200,
              ellipsis: true,
              scopedSlots: {customRender: 'billNo'},
              dataIndex: 'finalNo',
            },
            {
              title:'合同名称',
              align:"center",
              width:200,
              ellipsis: true,
              dataIndex: 'htmc',
            },
            {
              title:'合同金额(元)',
              align:"center",
              width:200,
              ellipsis: true,
              dataIndex: 'actualPaymentAmount',
            },
            {
              title:'经营团队',
              align:"center",
              width:150,
              ellipsis: true,
              dataIndex: 'jytd_dictText',
            },
            {
              title:'项目档案编号',
              align:"center",
              width:150,
              ellipsis: true,
              dataIndex: 'xmbh',
            },
            {
              title:'项目名称',
              align:"center",
              width:200,
              ellipsis: true,
              dataIndex: 'xmmc_dictText',
              scopedSlots: {customRender: 'fileSlot'},
            },
          ],
          defColumns: [
            {
              title: '序号',
              dataIndex: '',
              key:'rowIndex',
              width:60,
              align:"center",
              customRender:function (t,r,index) {
                return parseInt(index)+1;
              }
            },
            {
              title:'框架合同编号',
              align:"center",
              width:200,
              ellipsis: true,
              scopedSlots: {customRender: 'billNo'},
              dataIndex: 'finalNo',
            },
            {
              title:'合同名称',
              align:"center",
              dataIndex: 'htmc',
              width:200,
              ellipsis: true
            },
            {
              title:'业绩归属年度',
              align:"center",
              width:200,
              ellipsis: true,
              dataIndex: 'yjgsnd_dictText',
            },
            {
              title:'签订日期',
              align:"center",
              width:180,
              ellipsis: true,
              dataIndex: 'qdrq',
            },
            {
              title:'本次合同额(元)',
              align:"center",
              width:180,
              ellipsis: true,
              dataIndex: 'bchte',
            },
            {
              title:'签订单位',
              align:"center",
              width:180,
              ellipsis: true,
              dataIndex: 'qddw_dictText',
            },
            {
              title:'业主单位',
              align:"center",
              width:150,
              ellipsis: true,
              dataIndex: 'yzdw_dictText',
            },
            {
              title:'经营团队',
              align:"center",
              width:180,
              ellipsis: true,
              dataIndex: 'jytd_dictText',
            },
            {
              title:'申请人',
              align:"center",
              width:180,
              ellipsis: true,
              dataIndex: 'proposer_dictText',
            },
            {
              title:'申请部门',
              align:"center",
              width:180,
              ellipsis: true,
              dataIndex: 'proposerDeptId_dictText',
            },
            {
              title:'变更状态',
              align:"center",
              width:180,
              ellipsis: true,
              dataIndex: 'changeStatus_dictText',
            },
            {
              title:'合同档案状态',
              align:"center",
              width:180,
              ellipsis: true,
              dataIndex: 'status_dictText',
            },
          ],
          url: {
            // list: "/api/erp/finance/record/erpFinancePaymentAgainstDocumentsRecord/list",
            list: "/api/erp/omc/contractmanager/erpOmcContractManagerFinal/list",
            delete: "/api/erp/finance/record/erpFinancePaymentAgainstDocumentsRecord/delete",
            deleteBatch: "/api/erp/finance/record/erpFinancePaymentAgainstDocumentsRecord/deleteBatch",
            // exportXlsUrl: "/api/erp/finance/record/erpFinancePaymentAgainstDocumentsRecord/exportXls",
            exportXlsUrl: "/api/erp/omc/contractmanager/erpOmcContractManagerFinal/exportFrameworkContract",
            importExcelUrl: "/api/erp/finance/record/erpFinancePaymentAgainstDocumentsRecord/importExcel",
            rowData: "/api/erp/omc/contractmanager/erpOmcContractManagerFinal/list",
          },
          dictOptions:{},
          superFieldList:[],
        }
      },
      created() {
        //加载数据字典信息
        this.getSuperFieldList();
      },
      computed: {
        importExcelUrl: function(){
          return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`;
        },
      },
      methods: {
       async expand(expanded,record) {
          if (expanded) {
            this.expandedRowKeys = [record.id];
            let params = {
              frameContractId:record.id,
              bpmStatus:'2,3',
              htlx:1
            }
          const res = await  getAction(this.url.rowData,params)
          this.innerDataSource = res.result.records
          // this.$set(record, 'renderList',res.result.records)
          // this.$forceUpdate()
          console.log(res);
          console.log(this.dataSource,'this.dataSource---');
          console.log(expanded,record);
          }else {
            this.expandedRowKeys = []
          }
            
  
      },
      searchReset() {
      this.onClearSelected();
      this.queryParam = {}
      this.queryParam.htlx = '3'
      this.loadData(1)
    },
        loadData(arg) {
          if (!this.url.list) {
            this.$message.error('请设置url.list属性!')
            return
          }
          // 加载数据 若传入参数1则加载第一页的内容
          if (arg === 1) {
            this.ipagination.current = 1
          }
          var params = this.getQueryParams() // 查询条件
          // params.recordStatus = 'success,fail'
          this.loading = true
          getAction(this.url.list, params).then(res => {
            if (res.success) {
              this.dataSource = res.result.records.map(item=>{
                 return {
                    ...item,
                    renderList:[]
                 }

              })  
              if (res.result.total) {
                this.ipagination.total = res.result.total
              } else {
                this.ipagination.total = 0
              }
              //判断是否当前页没有数据且不为第一页
              if (this.dataSource.length == 0 && this.ipagination.current != 1) {
                this.ipagination.current = this.ipagination.current - 1
                this.loadData(this.ipagination.current - 1);
              }
              // update-end---author:zhangyafei    Date:20201118  for：适配不分页的数据列表------------
            } else {
              this.dataSource = [];
              this.ipagination.total = 0
              this.$message.warning(res.message)
            }
            if (res.code === 510) {
              this.$message.warning(res.message)
            }
            this.loading = false
          }).catch(err => {
            this.$message.warning(err.message)
          })
        },
        //查看详情
        getDetail(record) {
          console.log(record)
          this.$router.push({
             path: `/erp/omc/contractmanager/ErpOmcFrameworkContractArchiveDetail/${record.id}`
            })
        },

        initDictConfig(){
          //人员
          initDictOptions('erp_employee_file,name,id').then(async(res) => {
            if (res.success) {
              this.$set(this.dictOptions, 'reimburser', res.result)
            }
          })
        },
        getSuperFieldList(){
          let fieldList=[];
          fieldList.push({type:'string',value:'billNo',text:'单据编号',dictCode:''})
          fieldList.push({type:'string',value:'billType',text:'单据类型',dictCode:''})
          fieldList.push({type:'string',value:'billId',text:'单据主键',dictCode:''})
          fieldList.push({type:'string',value:'companyId',text:'公司id',dictCode:''})
          fieldList.push({type:'string',value:'reimburser',text:'报销人',dictCode:''})
          fieldList.push({type:'BigDecimal',value:'paymentAmount',text:'支付金额',dictCode:''})
          fieldList.push({type:'string',value:'presenter',text:'交单人',dictCode:''})
          fieldList.push({type:'date',value:'againstDocumentsTime',text:'交单时间'})
          fieldList.push({type:'Text',value:'attachment',text:'回单附件',dictCode:''})
          fieldList.push({type:'string',value:'billSchedule',text:'单据进度',dictCode:''})
          fieldList.push({type:'string',value:'billStatus',text:'单据状态',dictCode:''})
          this.superFieldList = fieldList
        }
      }
    }
  </script>
  <style scoped>
    @import '~@assets/less/common.less';
  </style>
  